{% extends "layout.html" %}


{% block body %}

<div class="container">

                <div class="row" style="padding: 10px 10px 10px;">
     
            <form method=POST action="{{ url_for('learnmode') }}" >

       
            <button type="submit" class= "btn btn-info  col-xs-3 col-sm-3 col-md-3 col-lg-3 " name="download" value=True  >Learnmode</button>
     

            </form>
                <div >     
                  <button type="submit" class= "btn btn-info col-xs-3 col-sm-3 col-md-3 col-lg-3  " id="shuffle" value=True  >Shuffle </button>
               </div> 
               


        	</div>

           
<div>
    <ul class="list-group" style="list-style-type:none">


 
        <li  class="list-group-item " id="li" style="border: 1px solid blue"> 
        <div >

                                  
                   <div class="row "  >
                          <div class=" col-xs-4 col-sm-4 col-md-4 col-lg-4" >
                          <p class="text-primary lead font-weight-bold "  preload="auto" id="word" style="zoom:90%;"></p>
                          </div> 
         
                           <div class=" col-xs-8 col-sm-8 col-md-8 col-lg-8" style="border: 1px solid blue">
                          <p class="text-primary lead font-weight-bold "  preload="auto" id="word_def" ></p>
                          </div>   

                       </div> 



          </div> 


        </li class="list-group">

 

   

    </ul>


</div>

           <div  style="padding: 10px 10px 10px;">


              <div class="row">
                <button  class="btn disabled btn-block" >  Vocavola         </button>
             </div>

            </div>

</div>
<script  src="/static/js/init.js" type=text/javascript >

</script>

<script  src="/static/js/testmode.js" type=text/javascript >

</script>

{% endblock %}

